Return to doc.sitecore.com

Documentation

 

1.  Introduction

The News Web Control is designed to render such Items as news outlines, event lists or other similar information. You can see the sample output of the control in the picture below:  

 

The output consists of two main fields:

The entries are sorted by date.  

The front-end appearance of the control can be customized via parameters (see the Valid Rendering Properties section for more details).

The control can show the latest news or the news for a defined period of time.  

Please refer to the Web Controls article for more information about creating Web Controls.

2.  Installation Guide

The News Web Control is distributed as a standard Sitecore package; hence in order to start using it, you should install the package. Please refer to the Installing Modules and Packages article if you are not familiar with the standard Sitecore Packager tool.  

After the package installation, you will see the News Web Control in the list of renderings.

Thus you will be able to place it on a (sub)layout or a link via placeholder like any other rendering.  

No modifications are required to use this Web Control, but you can modify the control’s setting (for example,  tag prefix) by editing the following Item:

/sitecore/layout/Renderings/news.xml  

 

3.  User Manual

The News is a common Web Control, thus you will be able to work with it like with any other rendering.  

Example:  

In the example below, we will create 2 news Items and then display them on the front-end:  

  1. Create a  template for news Items. The template should contain at least 3 fields:

    Date
    Type: datetime
    Defines the date of the news release;

    Description
    Type: text
    Defines short description of the news;

    Translate status
    Type: checkbox
    Identifies whether the Item is translated.
    Note: this field should not be shared.

    See the Valid Rendering Properties section for more details


  2. Create a couple of Items based on the News Simple Template.

    Sample news 1 Item:

    English date: 01-12-2005;
    Danish date: 03-12-2005.
    Check the Translate status checkbox of the English version; leave the one of the Danish unchecked.

    Sample news 2 Item

    English date: 07-12-2005;
    Danish date: 19-12-2005.

    Both of the languages should have the translate status checkboxes checked. Enter some text into the description fields.   

     
              
  3. Place the control on the layout and set properties.
    To set control properties, double-click it and you’ll see the configuration window.
    Open the Attributes tab and set properties as desired:

Take a look at the NewsMesage attribute. The value of this attribute is “$item.get_Item('description')”. It means that the control will show the value of the description field for every Item.  

If the text of the description field is too long, you can cut it down using the following construct:  

“$xslHelper.clip($item.get_Item('description'), 50, true)”

The number 50 stands for fifty characters here. So a User will see the first 50 characters of the message trailed by the ellipsis:  

   

Now you can request the Danish version of the page with the news using the sc_lang parameter:  

sc_lang=<language>

http://localhost/?sc _  

The December 19 entry is displayed in Danish, and the December 1 entry is displayed in English as long as the translated checkbox is not set for the Danish entry:  

The control checks whether the Translated Status checkbox is checked for the entry in a requested language. If the checkbox is unchecked, the entry in the default language (specified in the web.config file) is displayed.  

If a field containing the date is empty, the news Item will not be rendered.  

4.  Valid Properties

CssClass

Type: System.String

Property value:

The Css class name for the control.

Example:

.news

{

   width:170px;

}

 

CssStyle

Type: System.String

Property value:

The style for the control.

DividerCssClass

Type: System.String

Property value:

The Css class name for the divider.

Note:

The divider is placed after the news message only, not after the date title.

 

DividerStyle

Type: System.String

Property value:

The style for the divider.

 

TextCssClass

Type: System.String

Property value:

The Css class name for the news text.

 

TextStyle

Type: System.String

Property value:

The style for the news text.

Example:

.basic

{

  padding: 4px 15px 4px 15px;

  color: Maroon;

  font-family: Arial, Helvetica, sans-serif;

  font-size: 80%;

  font-weight: bold;

}

 

TitleCssClass

Type: System.String

Property value:

The Css class name for the news title.

Example:

.newstitle

{

  font-family: Arial, Helvetica, sans-serif;

  font-size: 130%;

  font-weight: bold;

  color: #E33226;

  letter-spacing: -1px;

  border-bottom-width: 1px;

  border-bottom-style: solid;

  border-bottom-color: #6D6D6D;

  padding-left: 15px;

  padding-bottom:3px;

}

 

TitleStyle

Type: System.String

Property value:

The style for the news title.

 

DividerImage

Type: System.String

Property value:

The path to the divider image for the control.

Note:

The divider isn’t shown if this path is not defined. By default, the path is not defined.

 

NewsMessage

Type: System.String

Property value:

The message which will be shown as the news text.

Note:

The message should have the format which can be recognized by the NVelocity class.

For more information about NVelocity see: http://nvelocity.sourceforge.net.

Item, xslHelper and stringHelper objects exist in Velocity by default.

Default value : $item.get_Item('description')

Example:

For example, you want to show an Abstract field in your Item as news. Your message should look like this:

 

$item.get_Item(“Abstract”)

 

This means that the value of the Abstract field will be used as the news message.

 

Example:

 

#if($item.get_Item(\"Country\").Length > 0)

#set ($counter = 0)

#set ($countOfCountries = $stringHelper.Split("|",$item.get_Item("Country")).Length)

#foreach($country in $stringHelper.Split("|",$item.get_Item("Country")))

#set ($counter = $counter + 1)

$item.Database.Items.get_Item("$country").Name

#if(($counter != $countOfCountries))

, #else

: #end

#end

#end

$xslHelper.clip($item.get_Item("Abstract"), 80, true)

 

This code will form the following news massage:

 

Country1,…,CountryN: abstract

 

Where Country is a multilist field which holds a list of countries.

Abstract is the Item’s memo field which holds an abstract for news.

 

$xslHelper.clip($item.get_Item("Abstract"), 80, true)

 

The abstract will be not longer than 80 characters (if it is longer, it will be cut and the ellipsis sign will be added to the news message)

 

TranslateStatusField

Type: System.String

Property value:

The name of the field that holds the translate status.

The field that holds the translate status can be any field which is evaluated as text (for example: valuelookup , text or checkbox)

Note:

The default value is “Translate status”.

 

DateFieldName

Type: System.String

Property value:

The name of the field which holds the date of news.

Note:

The default value is “date”.

 

SourceNode

Type: System.String

Property value:

The Sitecore path or ID of an Item which holds news Items.

Note:

The default value is /sitecore/content/News/News Archive.

 

TitleText

Type: System.String

Property value:

The text which will be shown as the title of the news.

Note:

The default value is Latest News.

 

NewsCount

Type: System.Int32

Property value:

The number of the latest news which are to be shown.

Note:

If NewsCount == 0, then all news Items under the SourceNode are shown. The default value is 0.

 

LowerBound

Type: System.String

Property value:

The ISO date of the lower bound of the news date range.

Note:

The ISO date format is: yyyymmdd, where yyyy is the year, mm is the month, dd is the day of the week.

If the LowerBound or UpperBound property is set, the NewsCount property will be applied to the resulting set of news.

The default property value is “00010101”

 

UpperBound

Type: System.String

Property value:

The ISO date of the upper bound of the news date. News with the date equal to UpperBound won’t be included in the output.

Note:

If the LowerBound or UpperBound property is set, the NewsCount property will be applied to the resulting set of news.

The default property value is “00010101”

 

Note:

Some of the properties such as TranslateStatusText and PartionalTranslateStatusText are preserved for compliance with Sitecore 4.

 

TranslateStatusText

Type: System.String

Property value:

The text which identifies whether an Item is translated into a specified language.

 

PartialTranslateStatusText

Type: System.String

Property value:

The text which identifies whether an Item is partially translated into a specified language.